<style lang="less" scoped>
@import "../../../../assets/css/applyDetail";
</style>
<template>
    <div class="applyDetail gpsAgainDistribute">
        <basicinfo v-bind:orderInfo="this.formData.orderInfo" :isNeedApproval="false"></basicinfo>
        <div class="div-gps-distribute detail-card" style="margin-top: 20px;">
            <Form ref="formData" :model="formData" :rules="formRules" :label-width="150" inline>
                <Collapse v-model="openPanel" simple>
                    <Panel name="1">
                        <span>车辆信息</span>
                        <div class="panel-content" slot="content">
                                <FormItem label="车辆品牌" prop="carDetails.brandName">
                                    <Input type="text" v-model="formData.carDetails.brandName" disabled/>
                                </FormItem>
                                <FormItem label="车辆类型" prop="carDetails.businessType">
                                    <Select v-model="formData.orderInfo.carType" filterable clearable disabled >
                                        <Option v-for="item in dataDic.carType" :value="item.value" :key="item.value" :label="item.title">
                                            {{ item.title }}
                                        </Option>
                                    </Select>
                                    <!--                        <Input type="text" v-model="formData.carDetails.businessType" disabled />-->
                                </FormItem>
                                <!--                    <FormItem label="车辆用途" prop="carDetails.carUse" >-->
                                <!--                        <Input disabled type="text" v-model="formData.carDetails.carUse" disabled/>-->
                                <!--                    </FormItem>-->
                                <FormItem label="款式" prop="carDetails.styleName" >
                                    <Input style="width: 563px" type="text" v-model="formData.carDetails.styleName" disabled/>
                                </FormItem>
                                <FormItem label="车型" prop="carDetails.modelName" >
                                    <Input type="text" v-model="formData.carDetails.modelName" disabled/>
                                </FormItem>
                                <FormItem label="车辆型号" prop="carDetails.fullModelNum" >
                                    <Input type="text" v-model="formData.carDetails.fullModelNum" disabled/>
                                </FormItem>
                                <FormItem label="发动机号" prop="carDetails.engineNo" >
                                    <Input type="text" v-model="formData.carDetails.engineNo" disabled/>
                                </FormItem>
                                <FormItem label="VIN码" prop="carDetails.carVin" >
                                    <Input type="text" v-model="formData.carDetails.carVin" disabled/>
                                </FormItem>
                        </div>
                    </Panel>
                    <Panel name="2">
                        <span>GPS历史派单</span>
                        <div class="panel-content" slot="content">
                            <Table border :columns="columnsHead" :data="formData.gpsOrderHistorys">
                                <template slot-scope="{ row, index }" slot="gpsSupplier">
                                    <div v-if="row.gpsSupplier === 'P-OLE'">欧拉
                                    </div>
                                    <div v-else-if="row.gpsSupplier === 'P-ZR'">中瑞
                                    </div>
                                    <div v-else-if="row.gpsSupplier === 'P-TY'">天易
                                    </div>
                                </template>
                            </Table>
                        </div>
                    </Panel>
                    <Panel name="3">
                        <span>GPS改派信息</span>
                        <div class="panel-content" slot="content">
                                <FormItem label="GPS供应商" prop="gpsInfo.gpsSupplier" :required=true>
                                    <Select v-model="formData.gpsInfo.gpsSupplier" filterable clearable @on-change="changeGpsSupplier(formData.gpsInfo.gpsSupplier)" >
                                        <Option v-for="item in gpsSupplier" :value="item.value" :key="item.value" :label="item.title">
                                            {{ item.title }}
                                        </Option>
                                    </Select>
                                </FormItem>
                                <FormItem label="是否盗抢险" prop="gpsInfo.isRobberyBag" :required=true>
                                    <Select v-model="formData.gpsInfo.isRobberyBag" clearable @on-change="changeIsRobberyBag">
                                        <Option value="1">是</Option>
                                        <Option value="0">否</Option>
                                    </Select>
                                </FormItem>
                                <FormItem label="GPS型号" prop="gpsInfo.gpsType" style="display:none;" >
                                    <Select v-model="formData.gpsInfo.gpsType"  disabled>
                                        <Option v-for="item in dataDic.gpsType" :value="item.value"
                                                :key="item.value" :label="item.title">
                                            {{ item.title }}
                                        </Option>
                                    </Select>
                                </FormItem>
                                <FormItem label="GPS型号">
                                    <Input type="text" v-model="gpsFullName" disabled/>
                                </FormItem>
                                <FormItem label="贷款期限" prop="gpsInfo.loanTerm" >
                                    <Input type="text" v-model="formData.costDetails.loanTerm" disabled />
                                </FormItem>
                                <FormItem label="现场联系人" prop="gpsInfo.siteContact" :required=true >
                                    <Input type="text" v-model="formData.gpsInfo.siteContact" />
                                </FormItem>
                                <FormItem label="联系电话" prop="gpsInfo.contactPhone" :required=true>
                                    <Input type="text" v-model="formData.gpsInfo.contactPhone" />
                                </FormItem>
                                <FormItem label="VIN码" prop="carDetails.carVin" :required=true>
                                    <Input type="text" v-model="formData.carDetails.carVin" disabled/>
                                </FormItem>
                                <FormItem label="安装时间" prop="gpsInfo.preInstallTime" :required=true>
                                    <DatePicker type="date" v-model="formData.gpsInfo.preInstallTime"
                                                format="yyyy-MM-dd"></DatePicker>
                                </FormItem>
                                <FormItem label="安装地址" prop="gpsInfo.installAddressTemp" :required=true>
                                    <Row type="flex" justify="start" align="middle">
                                        <Cascader :data="initLoadData" :load-data="loadData"
                                                  v-model="formData.gpsInfo.installAddressTemp" filterable/>
                                        <Col span="12">
                                            <Input style="width: 300px" type="text"
                                                   v-model="formData.gpsInfo.installAddress"/>
                                        </Col>
                                    </Row>
                                </FormItem>
                                <FormItem v-if="isViewRobberyBag" label="户籍地址" prop="gpsInfo.houseAddressTemp" >
                                    <Row type="flex" justify="start" align="middle">
                                        <Cascader :data="initLoadData" :load-data="loadData"
                                                  v-model="formData.gpsInfo.houseAddressTemp" filterable/>
                                        <Col span="12">
                                            <Input style="width: 300px" type="text"
                                                   v-model="formData.gpsInfo.houseAddress"/>
                                        </Col>
                                    </Row>
                                </FormItem>
                                <FormItem label="备注" prop="gpsInfo.remarks">
                                    <Input style="width: 930px" type="textarea" v-model="formData.gpsInfo.remarks" />
                                </FormItem>
                        </div>
                    </Panel>
                </Collapse>
            </Form>
        </div>
        <div class="footer">
            <div class="footer_content" style="text-align: center;">
                <Button type="primary" @click="distribute('formData')" :loading="distributeLoading" size="large" style="width: 100px;">二次派单</Button>
            </div>
        </div>
    </div>
</template>
<script>
    import {
        getDistributePageInfo,
        gpsInfoSubmitInfo
    } from "_p/afs-apply/api/apply-contract/contract/gps/gpsAgainDistribute";
    import {
        getGpsSupplier,
        getGpsFullName
    } from "_p/afs-apply/api/apply-contract/contract/entry/contract-entry";
    import {
        gpsDistributeHead
    } from "_p/afs-apply/api/apply-contract/contract/entry/contract-entry-table-head";
    import {
        deepClone
    } from '@/libs/utils/ObjectClone';
    import {getLocation} from "_p/afs-apply/api/apply-report/personal/common";
    import {formOperation} from "@/libs/utils/form-operation-util";
    import basicinfo from "_p/afs-apply/pages/apply-report/common/apply-basic-info.vue";
    import {getByTypes} from "_p/basic/api/admin/datadic";
    import {
        getDictDataByType
    } from "_p/basic/api/admin/datadic.js";
    import {getChannelId} from "@/projects/afs-apply/api/register-mng/listRecord";

    export default {
        components: {
            'basicinfo':basicinfo,
        },
        computed:{
            carNatureStr(){
                for(let i=0; i<this.dataDic.carNature.length;i++){
                    if(this.dataDic.carNature[i].value === this.formData.orderInfo.carNature){
                        return this.dataDic.carNature[i].title;
                    }
                }
                return "";
            },
            carTypeStr(){
                for(let i=0; i<this.dataDic.carType.length;i++){
                    if(this.dataDic.carType[i].value === this.formData.orderInfo.carType){
                        return this.dataDic.carType[i].title;
                    }
                }
                return "";
            },
            businessTypeStr(){
                for(let i=0; i<this.dataDic.businessType.length;i++){
                    if(this.dataDic.businessType[i].value === this.formData.orderInfo.businessType){
                        return this.dataDic.businessType[i].title;
                    }
                }
                return "";
            },
            operateWayStr(){
                for(let i=0; i<this.dataDic.operateWay.length;i++){
                    if(this.dataDic.operateWay[i].value === this.formData.orderInfo.operateWay){
                        return this.dataDic.operateWay[i].title;
                    }
                }
                return "";
            },
            affiliatedWayStr(){
                for(let i=0; i<this.dataDic.affiliatedWay.length;i++){
                    if(this.dataDic.affiliatedWay[i].value === this.formData.orderInfo.affiliatedWay){
                        return this.dataDic.affiliatedWay[i].title;
                    }
                }
                return "";
            },
            carPurposeStr(){
                for(let i=0; i<this.dataDic.carPurpose.length;i++){
                    if(this.dataDic.carPurpose[i].value === this.formData.orderInfo.carPurpose){
                        return this.dataDic.carPurpose[i].title;
                    }
                }
                return "";
            },
        },
        data () {
            return {
                openPanel: [1,2,3,4,5,6,7,8,9,10],
                applyNo: "",
                columnsHead: gpsDistributeHead,
                isHouseAddressRequired: false,
                isViewRobberyBag: false,
                distributeLoading: false,
                saveLoading: false,
                gpsFullName:'',
                loanTerm:0,
                initLoadData: [],
                gpsSupplier:[],
                formRules: {},
                formData: {
                    costDetails:{},
                    carDetails: {},
                    orderInfo: {},
                    gpsInfo: {},
                    gpsOrderHistorys: []
                },
                dataDic:{
                    businessType: [],
                    operateWay: [],
                    affiliatedWay: [],
                    carPurpose: [],
                    carType: [],
                    carNature: [],
                },
            }
        },
        mounted () {
            this.init();
        },
        methods: {
            init() {
                if (this.afs.getPageParams(this)) {
                    this.applyNo = this.afs.getPageParams(this).applyNo;
                }
                this.initSelectData();
                this.getDistributePageInfo();
                this.loadForm();
            },
            //加载页面form校验
            loadForm(){
                formOperation(this.$refs.formData.fields,this.formRules);
            },
            getDistributePageInfo() {
                getDistributePageInfo(this.applyNo).then(res => {
                    if (res.code === "0000") {
                        this.formData = deepClone(res.data);
                        this.loanTerm=res.data.costDetails[0].loanTerm;
                        this.gpsFullName=res.data.gpsFullName;
                        // let count=res.data.costDetails[0].loanTerm%12;
                        // if(count===0){
                            this.formData.costDetails.loanTerm=res.data.costDetails[0].loanTerm;
                        // }else{
                        //     this.formData.costDetails.loanTerm=parseInt((res.data.costDetails[0].loanTerm)/12)+1;
                        // }
                        if(Object.is(this.formData.gpsInfo.isRobberyBag,"1")){
                            this.isViewRobberyBag = true;
                            this.isHouseAddressRequired = true;
                        }else{
                            this.isViewRobberyBag = false;
                            this.isHouseAddressRequired = false;
                        }
                    }
                });
            },

            initSelectData(){
                let param  = {
                    level: '1',
                    upperCode: '1'
                };
                getLocation(param).then(res => {
                    if(res.code === "0000"){
                        res.data.forEach(function (e) {
                            if(e.isParent){
                                e.loading = false;
                                e.children = [];
                            }
                        });
                        this.initLoadData.push(...res.data);
                    }
                });
                //数据字典
                let arr = ["operateWay","gpsType", "affiliatedWay", "carPurpose", "businessType","carType","carNature"];
                getByTypes(arr).then(res => {
                    if (res.code === "0000") {
                        this.dataDic = deepClone(res.data);
                    }
                });
                getChannelId({}).then(ress => {
                    if (ress.code === "0000") {
                        let channelId = ress.data;
                        getGpsSupplier({channelId: channelId}).then(res => {
                            if (res.code === "0000") {
                                this.quotaControlSwitch=res.data.quota[0].quotaControlSwitch;
                                if (res.data.channelBaseInfo.gpsVendorAuthor === "all") {
                                    let param = {
                                        type: "gpsSupplier",
                                    };
                                    getDictDataByType(param.type).then(res => {
                                        if (res.code == "0000") {
                                            let tempArr = [];
                                            res.data.forEach((item, index) => {
                                                let obj = {
                                                    value: item.value,
                                                    title: item.title,
                                                }
                                                tempArr.push(obj);
                                            })
                                            this.gpsSupplier = tempArr;
                                        }
                                    })
                                } else {
                                    let arr = res.data.channelBaseInfo.gpsVendorAuthor.split(",");
                                    this.initDataic(arr);
                                }
                            }
                        });
                    }
                });
            },
            // 获取数据字典
            initDataic(arr) {
                let param = {
                    type: "gpsSupplier",
                };
                getDictDataByType(param.type).then(res => {
                    if (res.code == "0000") {
                        let tempArr = [];
                        res.data.forEach((item, index) => {
                            if (arr.indexOf(item.value) != "-1") {
                                let obj = {
                                    value: item.value,
                                    title: item.title,
                                }
                                tempArr.push(obj);
                            }
                        })
                        this.gpsSupplier = tempArr;
                    }
                })
            },
            loadData(item, callback){
                item.loading = true;
                getLocation({upperCode:item.value}).then(res => {
                    if(res.code === "0000"){
                        res.data.forEach(function (e) {
                            if(e.isParent){
                                e.loading = false;
                                e.children = [];
                            }
                        });
                        item.children = res.data;
                        item.loading = false;
                        callback();
                    }
                })
            },
            changeIsRobberyBag(val){
                if(Object.is(val,"1")){
                    this.isHouseAddressRequired = true;
                    this.isViewRobberyBag = true;
                    if(this.houseAddressTemp.length>0){
                        this.formData.gpsInfo.houseAddressTemp = this.houseAddressTemp;
                        this.formData.gpsInfo.houseAddress = this.houseAddress;
                    } else if(Object.prototype.hasOwnProperty.call(this.formData,"custAddressDetails") &&
                        Object.prototype.hasOwnProperty.call(this.formData.custAddressDetails,"addressTemp")){
                        this.formData.gpsInfo.houseAddressTemp = this.formData.custAddressDetails.addressTemp;
                        this.formData.gpsInfo.houseAddress = this.formData.custAddressDetails.detailAddress;
                    }else{
                        this.formData.gpsInfo.houseAddressTemp = [];
                        this.formData.gpsInfo.houseAddress = "";
                        this.formData.gpsInfo.houseProvince = "";
                        this.formData.gpsInfo.houseCity = "";
                        // this.formData.gpsInfo.houseCounty = "";
                        // this.formData.gpsInfo.houseStreet = "";
                    }
                }else if(Object.is(val,"0")){
                    this.isViewRobberyBag = false;
                    this.isHouseAddressRequired = false;
                    this.houseAddressTemp = this.formData.gpsInfo.houseAddressTemp;
                    this.houseAddress = this.formData.gpsInfo.houseAddress;
                    this.formData.gpsInfo.houseAddressTemp = [];
                    this.formData.gpsInfo.houseAddress = "";
                    this.formData.gpsInfo.houseProvince = "";
                    this.formData.gpsInfo.houseCity = "";
                }
            },
            distribute(name){
                this.formData.gpsInfo.carVin = this.formData.carDetails.carVin;
                this.formData.gpsInfo.loanTerm = this.loanTerm;
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        gpsInfoSubmitInfo(this.formData).then(result => {
                            if (result.code === "0000") {
                                this.$Message.success("申请成功");
                                this.afs.closeTab(this);
                            }
                        });
                    }else{
                        this.$Message.error('请补全信息');
                    }
                })
            },
            changeGpsSupplier(v){
                let params={
                    gpsFirm:v,
                    gpsType:this.formData.gpsInfo.gpsType,
                    downTerm:this.formData.costDetails.loanTerm
                }
                getGpsFullName(params).then(res =>{
                    if(res.code==='0000'){
                        if(typeof res.data.gpsFullName!=="undefined"){
                            this.gpsFullName=res.data.gpsFullName;
                        }
                    }
                })
            },
        }
    }
</script>
